<template>
  <div>
    <div class="box">
      <div class="topBox">
        <div class="title">采购申请审核流程</div>
        <a-button type="primary">编辑</a-button>
      </div>
      <div class="conBox">
        <div class="itemBox">
          <div>流程名称：组长审批</div>
          <div>审核人：张三</div>
        </div>
        <ArrowRightOutlined style="font-size: 22px; margin: 0 12px" />
        <div class="itemBox">
          <div>流程名称：部长审批</div>
          <div>审核人：张三</div>
        </div>
        <ArrowRightOutlined style="font-size: 22px; margin: 0 12px" />
        <div class="itemBox">
          <div>流程名称：总监审批</div>
          <div>审核人：张三、李四</div>
        </div>
      </div>
    </div>
    <div class="box">
      <div class="topBox">
        <div class="title">耗材领用审核流程</div>
        <a-button type="primary">编辑</a-button>
      </div>
      <div class="conBox">
        <div class="itemBox">
          <div>流程名称：组长审批</div>
          <div>审核人：张三</div>
        </div>
        <ArrowRightOutlined style="font-size: 22px; margin: 0 12px" />
        <div class="itemBox">
          <div>流程名称：部长审批</div>
          <div>审核人：张三</div>
        </div>
        <ArrowRightOutlined style="font-size: 22px; margin: 0 12px" />
        <div class="itemBox">
          <div>流程名称：总监审批</div>
          <div>审核人：张三、李四</div>
        </div>
      </div>
    </div>
    <div class="box">
      <div class="topBox">
        <div class="title">耗材退换审核流程</div>
        <a-button type="primary">编辑</a-button>
      </div>
      <div class="conBox"> </div>
    </div>
  </div>
</template>
<script setup lang="ts">
  import { ArrowRightOutlined } from '@ant-design/icons-vue';
</script>
<style lang="less" scoped>
  .box {
    padding: 20px;
    .topBox {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 16px;
      font-weight: 500;
      margin-bottom: 6px;
      .title {
        padding-left: 6px;
        border-left: 4px solid #186df5;
      }
    }
    .conBox {
      width: 100%;
      height: 130px;
      border: 1px solid rgba(228, 228, 228, 1);
      padding: 16px;
      border-radius: 8px;
      display: flex;
      .itemBox {
        width: 200px;
        height: 100%;
        border: 1px solid rgba(228, 228, 228, 1);
        border-radius: 8px;
        padding: 20px;
        line-height: 26px;
      }
    }
  }
</style>
